import { FormSchema } from '/@/components/Table';
import { UploadTypeEnum } from '/@/components/Form/src/jeecg/components/JUpload';
import { bindMapFormSchema } from '/@/utils/common/compUtils';
import { ColorInfo } from './calendar.d';
import { dateFormat } from '/@/utils/common/compUtils';

export const searchFormSchema: FormSchema[] = [
  {
    field: 'name',
    label: '具体事项',
    component: 'JInput',
    colProps: { span: 8 },
  },
  {
    field: 'status',
    label: '提醒类别',
    component: 'Select',
    componentProps: {
      options: [
        { label: '非常重要', value: 1 },
        { label: '重要', value: 1 },
        { label: '一般', value: 0 },
      ],
    },
    colProps: { span: 8 },
  },
  {
    field: 'fieldTime',
    component: 'RangePicker',
    label: '时间字段',
    colProps: {
      span: 8,
    },
  },
];

const mapFormSchema = bindMapFormSchema(
  {
    col_span_one: {
      colProps: {
        xs: 24,
        sm: 12,
      },
      itemProps: {
        labelCol: { xs: 24, sm: 5 },
        wrapperCol: { xs: 24, sm: 18 },
        colon: true,
      },
      style: { width: '100%' },
    },
    col_span_two: {
      colProps: {
        xs: 24,
        sm: 24,
      },
      itemProps: {
        labelCol: { xs: 18, sm: 3 },
        wrapperCol: { xs: 24, sm: 20 },
        colon: true,
      },
      style: { width: '100%' },
    },
  },
  'col_span_one'
);

export const HEADER_PRESET_BG_COLOR_LIST: ColorInfo[] = [
  {
    id: 0,
    name: '薄暮',
    color: '#F5222D',
  },
  {
    id: 1,
    name: '火山',
    color: '#FA541C',
  },
  {
    id: 2,
    name: '日暮',
    color: '#FAAD14',
  },
  {
    id: 3,
    name: '明青',
    color: '#13C2C2',
  },
  {
    id: 4,
    name: '极光绿',
    color: '#52C41A',
  },
  {
    id: 5,
    name: '拂晓蓝',
    color: '#1890FF',
  },
  {
    id: 6,
    name: '极客蓝',
    color: '#2F54EB',
  },
  {
    id: 7,
    name: '酱紫',
    color: '#722ED1',
  },
];

export const formSchema: FormSchema[] = [
  {
    label: '',
    field: 'id',
    component: 'Input',
    show: false,
  },
  {
    field: 'divider-base-info',
    component: 'Divider',
    label: '基础信息',
  },
  mapFormSchema(
    {
      field: 'title',
      label: '日程标题',
      component: 'Input',
      componentProps: {
        placeholder: '请输入标题',
      },
      required: true,
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'type',
      label: '日程类型',
      component: 'JDictSelectTag',
      componentProps: {
        dictCode: 'calendar_plan_type',
        placeholder: '请选择类型',
        stringToNumber: true,
      },
      required: true,
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'remindType',
      label: '提醒类型',
      component: 'JSelectMultiple',
      componentProps: {
        dictCode: 'remindMode',
        placeholder: '请选择提醒类型',
      },
      required: true,
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'urgentLevel',
      label: '紧急程度',
      component: 'JDictSelectTag',
      componentProps: {
        dictCode: 'urgent_level',
        placeholder: '请选择紧急程度',
        stringToNumber: true,
      },
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'reminderTime',
      label: '提醒时间',
      component: 'JDictSelectTag',
      componentProps: {
        dictCode: 'remindTime',
        placeholder: '请选择提醒时间',
        stringToNumber: true,
      },
      required: true,
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'reminds',
      label: '重复提醒',
      component: 'JDictSelectTag',
      componentProps: {
        dictCode: 'reminders',
        placeholder: '请选择重复提醒',
        stringToNumber: true,
      },
      required: true,
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'rangeTime',
      component: 'RangePicker',
      label: '日程时间',
      componentProps: ({ formModel }) => {
        console.log('wang-formModel', formModel);
        return {
          picker: 'date',
          valueFormat: 'YYYY-MM-DD HH:mm:ss',
          showTime: !formModel.allDay,
          onChange: (value, dateString) => {
            console.log('Selected Time: ', value);
            console.log('Formatted Selected Time: ', dateString);
            formModel.beginDate = dateFormat(value[0], 'yyyy-MM-dd hh:mm:ss');
            formModel.endDate = dateFormat(value[1], 'yyyy-MM-dd hh:mm:ss');
            console.log('Convert Formatted Selected Time: ', formModel.beginDate, formModel.beginDate);
          },
        };
      },
      required: true,
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'allDay',
      label: '是否全天',
      component: 'Switch',
      defaultValue: true,
      componentProps: {
        checkedValue: true,
        checkedChildren: '是',
        unCheckedValue: false,
        unCheckedChildren: '否',
      },
    },
    'col_span_one'
  ),
  {
    field: 'divider-other-info',
    component: 'Divider',
    label: '其他信息',
  },
  mapFormSchema(
    {
      field: 'planColor',
      component: 'Input',
      label: '颜色',
      slot: 'planColorPicker',
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'joinPerson',
      component: 'JSelectUserByDept',
      label: '部门选择用户',
      componentProps: {
        labelKey: 'realname',
        rowKey: 'id',
      },
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      field: 'remark',
      component: 'JEditor',
      label: '备注',
      colProps: { span: 24 },
      componentProps: {
        placeholder: '',
        autoSize: {
          minRows: 4,
          maxRows: 4,
        },
        showImageUpload: false,
      },
    },
    'col_span_two'
  ),
  // mapFormSchema(
  //   {
  //     field: 'remark',
  //     component: 'InputTextArea',
  //     label: '备注',
  //     colProps: { span: 24 },
  //     componentProps: {
  //       placeholder: '',
  //       autoSize: {
  //         minRows: 4,
  //         maxRows: 4,
  //       },
  //     },
  //     required: true,
  //   },
  //   'col_span_two'
  // ),
  {
    field: 'divider-annex-info',
    component: 'Divider',
    label: '附件信息',
  },
  mapFormSchema(
    {
      field: 'files',
      component: 'JUpload',
      helpMessage: '无限制上传',
      label: '文件',
    },
    'col_span_two'
  ),
  mapFormSchema(
    {
      field: 'imgs',
      component: 'JUpload',
      label: '图片',
      helpMessage: '无限制上传',
      componentProps: {
        fileType: UploadTypeEnum.image,
      },
    },
    'col_span_two'
  ),
];
